<juci-layout-with-sidebar>
	<div ng-controller="PagePhoneSpeedDialing">
		<juci-config-section>
			<juci-config-heading>{{ 'Speed Dialing' | translate }}</juci-config-heading>
			<juci-config-info>{{ 'phone.speed_dialing.info' | translate }}</juci-config-info>
			<juci-config-lines>
				<juci-config-line title="{{'Speed Dialing'|translate}}">
					<switch ng-model="speed_dialing" class="green"/>
				</juci-config-line>
			</juci-config-lines>
			<div class="row" ng-show="speed_dialing">
				<div class="col-md-6" ng-repeat="dial in speed_dials">
					<div class="col-md-3">#{{dial.tone}}</div>
					<div class="col-md-9 form-group">
						<input type="text" class="form-control" ng-model="dial.number"/>
					</div>
				</div>
			</div>
			<juci-config-lines  ng-show="speed_dialing">
				<juci-config-line title="{{'Remove all entries from speed dial list'|translate}}">
					<button class="btn btn-lg btn-default" ng-click="onClearAll()" translate>Clear</button>
				</juci-config-line>
			</juci-config-lines>
		</juci-config-section>
		<juci-config-apply></juci-config-apply>
	</div>
</juci-layout-with-sidebar>
